import React, { useRef, useState } from 'react';
import './Xinzeng.scss'
import { Editor } from '@tinymce/tinymce-react';
import 'dayjs/locale/zh-cn';
import locale from 'antd/es/date-picker/locale/zh_CN';
import {
    Button,
    DatePicker,
    Form,
    Input,
    Radio,
} from 'antd';
import type { DatePickerProps } from 'antd';

interface props {

}

function Xinzeng(props: props) {
    var log = () => {

    }
    const editorRef: any = useRef(null);
    const onChange: DatePickerProps['onChange'] = (date, dateString) => {
        console.log(date, dateString);
    };
    var [value, setvalue] = useState('')
    var onFinish = async (formvalues: any) => {
        console.log(formvalues);
        //   var res=  await service.publice_addmas({title:formvalues.title,})      
    }
    var tijiao = () => {

    }
    return (
        <div className='Xinzeng'>
            <div className='top'>
                <div className='text'>新增政策法规</div>
                <div className='button'> <Button  >
                    保存草稿
                </Button> <Button onClick={tijiao} >
                        提交
                    </Button></div>
            </div>
            <div className='biao'>
                <Form
                    name="basic"
                    onFinish={onFinish}
                    labelCol={{ span: 8 }}
                    wrapperCol={{ span: 16 }}
                    style={{ maxWidth: 800 }}
                    initialValues={{ remember: true }}
                    autoComplete="off"
                >
                    <Form.Item className='f1'
                        label="标题"
                        name="title"
                        rules={[{ required: true, message: 'Please input your username!' }]}

                    >
                        <Input />
                    </Form.Item>

                    <Form.Item className='f1'
                        label="摘要"
                        name="zhaiyao"
                    >
                        <Input style={{ height: 100 }} />
                    </Form.Item>
                    <Form.Item className='f1'
                        label="排序"
                        name="paixu"

                    >
                        <Input />
                    </Form.Item>
                    <Form.Item className='f1'
                        label="发布时间"
                        name="dateString"

                    >
                        <DatePicker locale={locale} onChange={onChange} />
                    </Form.Item>
                    <Form.Item className='f1'
                        label="Username"
                        name="username"

                    >
                        <>
                            <Editor
                                apiKey='your-api-key'
                                onInit={(evt, editor) => editorRef.current = editor}
                                initialValue="<p>This is the initial content of the editor.</p>"
                                init={{
                                    height: 300,
                                    menubar: false,
                                    plugins: [
                                        'advlist', 'autolink', 'lists', 'link', 'image', 'charmap', 'preview',
                                        'anchor', 'searchreplace', 'visualblocks', 'code', 'fullscreen',
                                        'insertdatetime', 'media', 'table', 'code', 'help', 'wordcount'
                                    ],
                                    toolbar: 'undo redo | blocks | ' +
                                        'bold italic forecolor | alignleft aligncenter ' +
                                        'alignright alignjustify | bullist numlist outdent indent | ' +
                                        'removeformat | help',
                                    content_style: 'body { font-family:Helvetica,Arial,sans-serif; font-size:14px }'
                                }}
                            />
                        </>
                    </Form.Item>



                    <Form.Item wrapperCol={{ span: 16 }} label="附件"
                        name="fujian">


                        <Button htmlType="submit">
                            上传
                        </Button>
                    </Form.Item>
                    <Form.Item wrapperCol={{ span: 16 }} label="状态"
                        name="value">
                        <Radio.Group name="radiogroup" defaultValue={1} value={value}>
                            <Radio value={1}>启用</Radio>
                            <Radio value={2}>禁用</Radio>

                        </Radio.Group>



                    </Form.Item>
                </Form>


            </div>


        </div>
    );
}

export default Xinzeng;